<template>
	
	<div>
		<Model v-bind:taskId="taskId" v-bind:userId="userId" ></Model>
	<div class="container">
	
    <!-- 审批信息 -->
    <div class="info-preview">
        <div class="h5-list-address content">
            <div class="h5-list-flex">
                <div class="h5-list-title-img"><img src="../../assets/images/icon_address.gif"></div>
                <div>房产地址：</div>
            </div>
            <div class="white h5-address">{{subscribeRoomInfo.roomCombox}}</div>
        </div>
        <div class="h5-list-flex h5-height-default content h5-user-info border-top-bottom-green">
            <div class="item left-item border-right-green">
                <div class="font12"><img src="../../assets/images/icon_user.png">发起人</div>
                <div class="white">{{subscribeRoomInfo.managersName}}</div>
            </div>
            
            <div class="item center-item border-right-green">
                <div class="font12"><img src="../../assets/images/icon_user.png">经办人</div>
                <div class="white">{{subscribeRoomInfo.managersName}}</div>
            </div>
            <div class="item right-item">
                <div class="font12"><img src="../../assets/images/icon_user.png">客户姓名</div>
                <div class="white">{{subscribeRoomInfo.customerName}}</div>
            </div>
        </div>
        <div class="content">
            <div class="h5-list-flex h5-apply-time">
                <div class="h5-list-title-img"><img src="../../assets/images/icon_date.png"></div>
                <div>申请时间：{{subscribeRoomInfo.applyDateStr}}</div>
            </div>
        </div>
    </div>
    <!-- 申请原因 h89-->
    <div class="h5-list border-top-bottom-default">
            <div class="h5-list-box">
                <div class="h5-list-flex h5-list-title border-bottom-primary green">
                    <div class="h5-list-title-img"><img src="../../assets/images/title-apply.png"></div>
                    	申请原因
                </div>
                <div class="content">
                    <div class="h5-list-txtarea h5-list-line-wrap">{{subscribeRoomInfo.remark}}</div>
                </div>
            </div>
        </div>
    
    <!-- 换房前信息 h90-->   
    <div class="h5-list border-top-bottom-default">
            <div class="h5-list-box">
                <div class="h5-list-flex h5-list-title border-bottom-primary green">
                    <div class="h5-list-title-img"><img src="../../assets/images/title-info-default.png"></div>
                    换房前信息
                </div>
                <div class="content">
                    <div class="h5-list-flex h5-height-default border-bottom-primary">
                        <div class="h5-item-label">姓&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名：</div>
                        <div class="h5-item-content">{{subscribeRoomInfo.customerName}}</div>
                    </div>
                    <div class="h5-list-flex h5-height-default border-bottom-primary">
                        <div class="h5-item-label">认购时间：</div>
                        <div class="h5-item-content">{{subscribeRoomInfo.contractDateStr}}</div>
                    </div>
                    <div class="h5-list-flex h5-height-default border-bottom-primary">
                        <div class="h5-item-label">原 房 产：</div>
                        <div class="h5-item-content">
                          {{subscribeRoomInfo.roomCombox}}
                        </div>
                    </div>
                    <div class="h5-list-flex h5-height-default border-bottom-primary">
                        <div class="h5-item-label">原计价面积：</div>
                        <div class="h5-item-content">{{subscribeRoomInfo.calculateArea}}m2</div>
                    </div>
                    <div class="h5-list-flex h5-height-default border-bottom-primary">
                        <div class="h5-item-label">原 单 价：</div>
                        <div class="h5-item-content">{{subscribeRoomInfo.conversionPrice}}元</div>
                    </div>
                    <div class="h5-list-flex h5-height-default border-bottom-primary">
                        <div class="h5-item-label">原折前总价：</div>
                        <div class="h5-item-content">{{subscribeRoomInfo.lumpsumPrice}}元</div>
                    </div>
                   
                </div>
            </div>
        </div>
    
    <!-- 换房后信息 h86-->
    <div class="h5-list after">
            <div class="h5-list-box">
                <div class="h5-list-flex h5-list-title border-bottom-primary h5-title-height-md orange">
                    <div class="h5-list-title-img"><img src="../../assets/images/title-info-after.png"></div>
                    换房后信息
                </div>
                <div class="content">
                    <div class="h5-list-flex h5-height-default border-bottom-primary">
                        <div class="h5-item-label">所换房产：</div>
                        <div class="h5-item-content">
                           {{subscribeRoomInfo.newRoomName}}
                        </div>
                    </div>
                    <div class="h5-list-flex h5-height-default border-bottom-primary">
                        <div class="h5-item-label">所换计价面积：</div>
                        <div class="h5-item-content">{{subscribeRoomInfo.calculateArea1}}m2</div>
                    </div>
                    <div class="h5-list-flex h5-height-default border-bottom-primary">
                        <div class="h5-item-label">所换单价：</div>
                        <div class="h5-item-content">{{subscribeRoomInfo.bfdUnitPrice}}元</div>
                    </div>
                    <div class="h5-list-flex h5-height-default">
                        <div class="h5-item-label">所换折前总价：</div>
                        <div class="h5-item-content">{{subscribeRoomInfo.bfdTotalPrice}}元</div>
                    </div>
                </div>
            </div>
        </div>
     <!--设置单页面标题-->
	    <Document v-bind:processId="processId"></Document>

    
    <!-- 附件 h99-->
   <ActivityFile v-bind:objectId="objectId" v-bind:imageType="imageType"></ActivityFile>
    
    <!-- 审批进度 h99-->
  	<ActivityHistory v-bind:processId="processId" v-bind:userId="userId"></ActivityHistory>
    </div>
    <div class="h5-btn-list">
         <a class="h5-btn h5-btn-primary md-trigger" style="width: 100%;" data-modal="modal-1">审核</a>
    </div>
	
		
	</div>
</template>
<script>
	import Model from '../common/modal.vue'
	import ActivityFile from '../common/activityFile.vue'
	import Document from '../common/document.vue'
	import ActivityHistory  from '../common/activityHistory.vue'
	export default{
		data(){
			return{
				subscribeRoomInfo:{},
				taskId:'',
				checkStatus:'',
				userId:'',
				objectId:'',
				imageType:'',
				processId:''
			}
		},
		mounted:function(){
			this.initSubscribeRoomInfo();
			//初始化加载
		},components: {
			Model,
			ActivityFile,
			ActivityHistory,
			Document
		},
		methods:{ //方法定义
			initSubscribeRoomInfo:function(){
				var _self = this;
				var busKey = _self.$route.params.busKey;
				_self.taskId = _self.$route.params.taskId;
				_self.userId = _self.$route.params.userId;
				_self.objectId = busKey;
				_self.imageType = '6';
				_self.processId = _self.$route.params.processId;
				var url = _self.utilHelper.apiUrl+'/wordFlowData/subscribeRoomChange';
				var params = {
					id:busKey
				};
				_self.$http.post(url,params).then((response)=>{
					var body = response.body;
					if(body.res=="1"){
						_self.subscribeRoomInfo = body.obj.subscribeRoomChange;
					}else{
						layer.alert("接口异常,请联系管理员!");
					}
				});
			}
		
		}
		
	}

</script>
